{extend name="property/public/insidePageBase" /}
{block name="title"}公摊方案详情{/block}
{block name="body"}
<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-form  layui-form-pane">
            <!--方案信息 add-->
            <div class="layui-row">
                <div class="layui-col-xs5">
                    <div class="layui-form-item">
                        <label class="layui-form-label">设备信息</label>
                        <div class="layui-input-block">
                            <input type="text"  value="{$planInfo['energy_name']??''} - {$planInfo['energy_no']??''}" disabled autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs3">
                    <div class="layui-form-item">
                        <label class="layui-form-label">公摊方式</label>
                        <div class="layui-input-block">
                            {if $planInfo['plan_type'] == 1} <input type="text"  value="按面积公摊" disabled autocomplete="off" class="layui-input"> {/if}
                            {if $planInfo['plan_type'] == 2} <input type="text"  value="按比例公摊" disabled autocomplete="off" class="layui-input"> {/if}
                            {if $planInfo['plan_type'] == 3} <input type="text"  value="按用量 比例" disabled autocomplete="off" class="layui-input"> {/if}
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs4">
                    <div class="layui-form-item">
                        <label class="layui-form-label">创建时间</label>
                        <div class="layui-input-block">
                            <input type="text" value="{$planInfo['add_time']??''}" disabled autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">备注说明</label>
                <div class="layui-input-block">
                    <textarea placeholder="{$planInfo['remark']??''}" disabled class="layui-textarea"></textarea>
                </div>
            </div>
            <!--方案信息 end-->
            <!--关联床位信息 add-->
            <script type="text/html" id="toolSharedRoomListbar">
                <div class="layui-btn-container">
                    {if $addRoomAuth}<button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="addSharedRoom"> 添加公摊房间 </button>{/if}
                    {if $delRoomAuth}<button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="deleteSharedRoom"> 删除公摊房间 </button>{/if}
                </div>
            </script>
            <table class="layui-hide" id="roomSharedRoomList" lay-filter="roomSharedRoomList"></table>
            <script type="text/html" id="tableSharedRoomListBar">
                <div class="layui-btn-group">
                    {if $editRoomAuth} <a class="layui-btn layui-btn-sm  layui-btn-normal" lay-event="editSharedRoom">编辑</a>{/if}
                    {if $detailRoomAuth}<a class="layui-btn layui-btn-sm" lay-event="detailsSharedRoom">详情</a>{/if}
                    {if $delRoomAuth}<a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="deleteSharedRoom">删除</a>{/if}
                </div>
            </script>
            <script type="text/html" id="scale_tpl">
                {if $planInfo['is_type'] === 1}
                <span>默认均分</span>
                {else/}
                <span>{{d.scale}} %</span>
                {/if}
            </script>
            <!--关联床位信息 end-->
        </div>
    </div>
</div>
{/block}
{block name="js"}
{__block__}
<script>
    layui.use(['form', 'layer', 'table','upload'], function () {
        var form = layui.form,layer = layui.layer,  $ = layui.$, table = layui.table,upload = layui.upload;
        let planId = {$planInfo['id']};
        <!-- 关联床位信息 add-->
        var tableSharedRoomListId = 'roomSharedRoomList';
        table.render({
            elem: '#'+tableSharedRoomListId,
            id:tableSharedRoomListId,
            url: '{:url("propertyEnergySharedRoomList")}?plan_id='+planId,
            toolbar: '#toolSharedRoomListbar',
            cols: [[
                {type: 'checkbox', fixed: 'left', rowspan: 2},
                {field: 'full_room_name', width: 258, title: '床位信息', templet:'#room_name_tpl'},
                {if $planInfo['plan_type'] == 2}{field: 'scale', width: 108, title: '公摊比例', sort: true, templet: '#scale_tpl'},{/if}
                {field: 'use_num_z', width: 128, title: '本期用量', sort: true},
                {field: 'remark', minWidth: 128, title: '备注说明', sort: true},
                {title: '操作', width: 168, toolbar: '#tableSharedRoomListBar', fixed:'right'}
            ]],
            limits: [10, 15, 20, 25, 50, 100],
            limit: 15,
            page: true,
            height: 'full-310'
        });

        table.on('toolbar('+tableSharedRoomListId+')', function (obj) {
            if (obj.event === 'addSharedRoom') {  // 监听添加操作
                var url = '{:url("propertyEnergySharedRoomAdd")}?plan_id='+planId;
                var index = layer.open({title: '添加公摊房间', type: 2, shade: 0.2,maxmin:true, area:['680px', '90%'], content: url, btnAlign: 'c', btn: ['确定', '取消'],offset:'rt', yes: function (index, layero) {
                        var iframeWindow = window['layui-layer-iframe' + index], submit = layero.find('iframe').contents().find("#submitBtn");
                        iframeWindow.layui.form.on('submit(submitBtn)', function (data) {
                            var field = data.field; //获取提交的字段
                            field = JSON.stringify($(layero.find('iframe').contents().find('#submitform')).serializeObject())
                            var loadAdd = layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                            $.ajax({
                                type:'post',  url: url, contentType: 'application/json', data: field, success: function(res) {
                                    layer.close(loadAdd);
                                    if (res.code === 0) {
                                        table.reload(tableSharedRoomListId); //数据刷新
                                        layer.close(index); //关闭弹层
                                        layer.msg(res.msg, {icon: 6, offset: '15px'});
                                    } else {
                                        layer.msg(res.msg, {icon: 5, offset: '15px'});
                                    }
                                }
                            })
                        });
                        submit.trigger('click');
                    }
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
            } else if (obj.event === 'deleteSharedRoom') {  // 监听删除操作
                var checkStatus = table.checkStatus(obj.config.id),data = checkStatus.data;
                var data = checkStatus.data, id = [];
                for (elem in data) {
                    id.push(data[elem].id);
                }
                if (id.length === 0) {
                    return layer.msg('请选择要删除的数据');
                }
                var url = '{:url("propertyEnergySharedRoomDel")}';
                layer.confirm('删除后不可恢复！  是否确认? ', {icon: 3}, function () {
                    var loadAdd = layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                    $.post(url, {ids: id}, function (res) {
                        layer.close(loadAdd);
                        if (res.code === 0) {
                            table.reload(tableSharedRoomListId); //数据刷新
                            layer.msg(res.msg, {icon: 6, offset: '15px'});
                        } else {
                            layer.msg(res.msg, {icon: 5, offset: '15px'});
                        }
                    });
                });
            }
        });

        table.on('tool('+tableSharedRoomListId+')', function (obj) {
            var data = obj.data;
            if (obj.event === 'editSharedRoom') {
                var url = '{:url("propertyEnergySharedRoomEdit")}?id='+data.id;
                var index = layer.open({
                    title: '编辑公摊房间', type: 2,  shade: 0.2, maxmin:true, area:['680px', '400px'],content: url, btnAlign: 'c', btn: ['确定', '取消'], yes: function (index, layero) {
                        var iframeWindow = window['layui-layer-iframe' + index], submit = layero.find('iframe').contents().find("#submitBtn");
                        iframeWindow.layui.form.on('submit(submitBtn)', function (data) {
                            var field = data.field; //获取提交的字段
                            var loadAdd = layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                            $.post(url, field, function (res) {
                                layer.close(loadAdd);
                                if (res.code === 0) {
                                    table.reload(tableSharedRoomListId); //数据刷新
                                    layer.close(index); //关闭弹层
                                    layer.msg(res.msg, {icon: 6, offset: '15px'});
                                } else {
                                    layer.msg(res.msg, {icon: 5, offset: '15px'});
                                }
                            });
                        });
                        submit.trigger('click');
                    }
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
                return false;
            } else if (obj.event === 'detailsSharedRoom') {
                var url = '{:url("propertyEnergySharedRoomDetail")}?shared_room_id='+data.id;
                var index = parent.layer.open({
                    title: data.full_room_name + '  公摊详情', type: 2,   shade: 0.2,maxmin: true, shadeClose: true,  move: false, area: ['800px', '100%'], offset: 'rt',anim: 2,content: url,n: false, end: () => {
                        table.reload(tableId); //数据刷新
                    }
                });
                return false;
            }  else if (obj.event === 'deleteSharedRoom') {
                var url = '{:url("propertyEnergySharedRoomDel")}';
                layer.confirm('删除后不可恢复！  是否确认? ', {icon: 3}, function () {
                    var loadAdd = layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                    $.post(url, {ids: [data.id]}, function (res) {
                        layer.close(loadAdd);
                        if (res.code === 0) {
                            table.reload(tableSharedRoomListId); //数据刷新
                            layer.msg(res.msg, {icon: 6, offset: '15px'});
                        } else {
                            layer.msg(res.msg, {icon: 5, offset: '15px'});
                        }
                    });
                });
            }
        });
        <!-- 关联床位信息 end-->
    });
</script>
{/block}